<template>
	<div>
		<Card>拼团列表
			<Icon type="ios-arrow-forward" /> 人员名单</Card>
		<Card>
			<p>小区地址：{{ $route.query.address }}</p>
			<br />
			<p>队长名称：{{ $route.query.name }}</p>
			<br />
			<p>发起时间：{{ $route.query.time }}</p>
			<br />
			<p>状态：{{ $route.query.status }}</p>
			<br />
			<hr />
			<br />
			<h1>成员信息</h1>
			<!-- 成员信息列表 -->
			<Table border :columns="columns1" :data="teamList"></Table>
			<!-- 分页 -->
			<br />
			<div style="text-align: center;">
				<Page :total="total" show-sizer show-elevator @on-change="changePage" />
			</div>
		</Card>
		<!-- 删除模态框 -->
		<Modal v-model="modal1" title="删除成员" @on-ok="ok" @on-cancel="cancel">
			<p>您确定要删除此成员吗？</p>
		</Modal>
	</div>
</template>

<script>
	import path from '@/api/path.js';
	import axios from '@/libs/api.request';
	let url = path.url;

	export default {
		data() {
			return {
				id: this.$route.query.id,
				teamList: [],
				columns1: [{
						title: '活动编号',
						key: 'id',
						align: 'center'
					},
					{
						title: '成员名称',
						key: 'name',
						align: 'center'
					},
					{
						title: '参与时间',
						key: 'createTime',
						align: 'center'
					},
					{
						title: '手机号码',
						key: 'mobile',
						align: 'center'
					},
					{
						title: '操作',
						key: 'action',
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h('Button', {
									props: {
										type: 'error',
										size: 'large'
									},
									on: {
										click: () => {
											this.delect(params.row.id)
										}
									}
								}, '删除')
							]);
						}
					}
				],
				total: 0,
				page: 1,
				delectId: 0,
				modal1: false
			}
		},
		methods: {
			// 获取成员列表
			getTeamList() {
				axios.request({
					url: `${url}GroupFound/getGroupFollow`,
					method: 'post',
					data: {
						id: this.id,
						page: this.page
					}
				}).then(res => {
					if (res.data.status == 1) {
						this.teamList = res.data.content.data;
						console.log('接受到的数据：', res, '传递的参数：', this.id);
					} else {
						throw res.data.msg
					}
				})
			},
			// 分页跳转
			changePage(idx) {
				this.page = idx;
				this.getSupervisorApplyList();
			},
			// 点击删除
			delect(id){
				this.modal1 = true;
				this.delectId = id;
			},
			// 确认删除
			ok () {
				axios.request({
					url: `${url}GroupFound/delGroupFollow`,
					method: 'post',
					data: {
						id: this.delectId
					}
				}).then(res=>{
					this.getTeamList();
				})
			},
			// 取消删除
			cancel () {
				this.$Message.info('您取消了删除此成员！');
			},
		},
		created() {
			this.getTeamList()
		}
	}
</script>

<style>

</style>
